<template>


    <a-modal :title="title" :width="600" :destroyOnClose="true" :maskClosable="false"
             :visible="visible" @cancel="handleCancel"
    >

        <a-checkbox-group @change="onChange">
            <a-row :gutter="[16,16]">
                <a-col :span="8"   v-for="(item,index) in  list" :key="index">
                    <a-checkbox :value="item">
                        高级软件工程师
                    </a-checkbox>
                </a-col>
            </a-row>
        </a-checkbox-group>
        <!-- Modal 页脚 -->
        <template slot="footer">
            <a-button   @click="handleCancel">关闭</a-button>
            <a-button type="primary" :loading="loading" @click="onSubmit">保存</a-button>
        </template>

    </a-modal>

</template>
<script>
    export default {

        props:["xxx"],
        data() {
            return {
                loading: false, //按钮Loading
                title:"分组设置",
                list:[1,2,3,4,5,6,7,8,9,10,11,12,13,14],
                visible: true, //modal 显示状态
            };
        },
        methods: {


            //关闭弹窗
            handleCancel() {
                this.visible = false;
                this.$emit('closeModal', {
                    render: false
                });
            },




            //完成监听
            onSubmit(e) {
                //AJAX时间数据处理

                //关闭弹窗
                this.visible = false;
                this.$emit('closeModal', {render: false});

            },
            ///分组选择
            onChange(checkedValues) {
                console.log('checked = ', checkedValues);
            },



        },
    };
</script>
